<template>
	<view class="">
		<view class="title" v-if="alist.length">积分加成长值开心兑</view>
		<view class="row" v-for="(item, index) in alist" v-if="item.exchange_way!=1" @click="toDetail(item)">
			<image class="rowimg" :src="item.image" mode="aspectFit"></image>
			<view class="box">
				<view class="rowname">{{item.name}}</view>
				<view class="flex-start">
					<view class="rowtit">{{item.need_integral}}<text class="rowtext">积分</text></view>
					<view v-if="item.exchange_way!=1" class="rowtit">+{{item.need_money}}<text class="rowtext">成长值</text></view>
				</view>
			</view>
		</view>
<!-- 		<view class="row" v-for="(item, index) in alist" v-if="item.need_money==29" @click="toDetail(item)">
			<image class="rowimg" :src="item.image" mode=""></image>
			<view class="box">
				<view class="rowname">{{item.name}}</view>
				<view class="flex-start">
					<view class="rowtit">{{item.need_integral}}<text class="rowtext">积分</text></view>
					<view v-if="item.exchange_way!=1" class="rowtit">+{{item.need_money}}<text class="rowtext">成长值</text></view>
				</view>
			</view>
		</view> -->

		<view class="title" v-if="clist.length">积分天天兑</view>
		<view class="line flex-start" v-for="(item, index) in clist" v-if="item.exchange_way==1" @click="toDetail(item)">
			<image class="lineimg" :src="item.image" mode="aspectFit"></image>
			<view class="linebox">
				<view class="linename">{{item.name}}</view>
				<view class="rowtit linetit">{{item.need_integral}}<text class="rowtext">积分</text></view>
			</view>
		</view>
	</view>
	<!-- <view class="goods-list">
		<view class="goods-double double flex flex-wrap row-between col-stretch p-l-20 p-r-20">
				<view class="item bg-white" :style="{width: '347rpx', height: '100%'}" v-for="(item, index) in list" :key="index" @click="toDetail(item)">
					<view class="goods-img">
						<u-image width="347rpx" height="347rpx" :border-radius="10" :src="item.image"></u-image>
					</view>
					<view class="goods-info" style="padding: 22rpx 20rpx;">
						<view class="" style="padding: 10rpx 0">{{item.name}}</view>
						<view class="price mt10 row">
							<text class="primary" style="font-size: 44rpx; color: #cea757;">
								<text style="font-size: 24rpx;">积分</text>{{item.need_integral}}</text>
	                    	<text v-if="item.exchange_way==2" style="color: #cea757;">+</text>
	                        <price-format v-if="item.exchange_way==2" :first-size="46" :second-size="32" :subscript-size="32"
	                            :price="item.need_money" :weight="500" />
						</view>
					</view>
				</view>
		</view>
	</view> -->
</template>

<script>
	import {
		integralGoodsTypeList
	} from "@/api/store"
	export default {
		props: {
			
		},
		data() {
			return {
				list:[],
				alist:[],
				clist:[],
			};
		},
		onLoad(options){

			this.getIntegralGoodsTypeList(options.typeId)
		},
		methods: {
			toDetail(item){
				uni.navigateTo({
					url:'/bundle/pages/integralMallDetail?obj='+encodeURIComponent(JSON.stringify(item))
					// url:'/bundle/pages/integralMallDetail?obj='+JSON.stringify(item)
				})
			},
			getIntegralGoodsTypeList(id){
				let dlist = [];
				let selllist = [];
				integralGoodsTypeList({
					type:id
				}).then(res => {
					if (res.code == 1) {
						this.list=res.data.goods
						this.list.forEach((item, index) => {
							if (item.exchange_way!=1) {
								selllist.push(item);
								this.alist = [ ...selllist];
							} else {
								dlist.push(item);
								this.clist = [ ...dlist];
							}
						})
						// that.shoplist = [...list, ...selllist];
					}
				}).catch(() => {
					this.mescroll.endErr();
				})
			},
		}
	}
</script>

<style lang="scss" scoped>
	.goods-list {
		padding-bottom: 80rpx;
			.item {
				width: 347rpx;
				border-radius: 10rpx;
				overflow: hidden;
				margin-bottom: 30rpx;
				.goods-info {
					padding: 10rpx;
					
				}
			}
		.goods-double {
			.item {
				width: 347rpx;
				border-radius: 10rpx;
				overflow: hidden;
			
				.goods-info {
					padding: 10rpx;
					.goods-name {
						height: 80rpx;
						line-height: 40rpx;
					}

				}
			}
		}

	}
	.goods-img{
		border-bottom: solid 1rpx rgba(0,0,0,0.1);
	}
	.title{
		font-size: 38rpx;
		color: #caa861;
		margin: 30rpx 24rpx;
	}
	.row{
		display: inline-block;
		margin-left: 24rpx;
		margin-bottom: 30rpx;
		width: 340rpx;
		background-color: #fff;
		border-radius: 26rpx 26rpx 0 0;
	}
	.box{
		background-color: #fff;
		padding: 10rpx 18rpx;
		margin-top: -16rpx;
		// border-radius: 0 0 26rpx 26rpx;
	}
	.rowimg{
		width: 100%;
		height: 230rpx;
		border-radius: 26rpx 26rpx 0 0;
	}
	.rowtit{
		margin-top: 8rpx;
		color: #caa861;
		font-size: 36rpx;
	}
	.rowtext{
		font-size: 22rpx;
	}
	.line{
		margin: 0 24rpx;
		background-color: #fff;
		border-radius: 26rpx;
		margin-bottom: 28rpx;
	}
	.lineimg{
		width: 350rpx;
		height: 230rpx;
		border-radius: 26rpx;
	}
	.linebox{
		margin: 0 auto;
		text-align: center;
	}
	.linetit{
		margin: 0 auto;
		margin-top: 18rpx;
		color: #fff;
		background-color: #cca759;
		width: 180rpx;
		border-radius: 20rpx;
	}
</style>